.s-progress {
  display: flex;
  align-items: center;

  &-bar {
    position: relative;
    overflow: hidden;
    flex: 1;
    height: $progress-height;
    border-radius: $progress-border-radius;
    background: $progress-background;

    &__inner {
      position: absolute;
      display: flex;
      align-items: center;
      justify-content: flex-end;
      height: 100%;
      transition: width $animation-duration-base ease;
      border-radius: inherit;
      background: $primary;

      &-text {
        font-size: $progress-inner-text-size;
        padding: 0 10rpx;
        color: $progress-inner-text-color;
      }
    }
  }

  &__text {
    font-size: $progress-text-size;
    margin-left: 20rpx;
    color: $progress-text-color;
  }
}